<template>
  <view class="setting-container">
    <e-navbar leftTitle="设置"></e-navbar>
    <u-gap height="15"></u-gap>
    <view class="main-card mine-info-card" style="padding: 0 30rpx">
      <view class="cell-item " v-for="(item, index) in settingList" :key="index" @click="handleSettingItem(item,index)">
        <view class="label">{{item.label}}</view>
        <view class="value flex col-center">
          <view v-if="item.value">{{item.value}}</view>
          <u-icon v-if="item.id != 3" name="arrow-right" size="14" color="#7E828C"></u-icon>
        </view>
      </view>
    </view>
    <u-gap height="140"></u-gap>
    <view class="logout-btn">
      <u-button type="primary" text="退出登录" @click="handleLogOut"></u-button>
    </view>
    <!--<view class="main-btn m-30">-->
    <!--  <u-button text="确定" color="#1F66FF" @click="handleConfirmBtn"></u-button>-->
    <!--</view>-->
    <e-popup ref="deleteCache" @close="handleClosePopup" @confirm="handleConfirmPopup"></e-popup>

  </view>
</template>

<script>
export default {
  data() {
    return {
      settingList: [
        // {
        //   id: 1,
        //   label: "支付密码",
        //   value: "",
        //   url: "/pages/mine/setting/payPassword/payPassword",
        // },
        {
          id: 2,
          label: "隐私协议",
          value: "",
          url: "/pages/mine/setting/agreement/agreement?type=privacy_policy",
        },
        // {
        //   id: 3,
        //   label: "当前版本",
        //   value: "",
        //   url: "",
        // },
        // {
        //   id: 4,
        //   label: "清理缓存",
        //   value: "",
        //   url: "",
        // },
        {
          id: 5,
          label: "注销账号",
          value: "",
          url: "/pages/mine/setting/deleteAccount/deleteAccount",
        },
      ],
    };
  },
  onLoad() {
    // #ifdef MP-WEIXIN
    let accountInfo = uni.getAccountInfoSync();
    console.log(accountInfo);
    this.settingList[1].value = accountInfo.miniProgram.version || "2.1.2";
    // #endif
  },
  methods: {
    handleConfirmBtn() {
      console.log("确定");
    },
    handleSettingItem(item, index) {
      switch (item.id) {
        case 1:
        case 2:
        case 5:
          uni.navigateTo({
            url: item.url,
          });
          break;
        case 4:
          this.$refs.deleteCache.handleShowPopup("确定清除缓存吗？");
          break;
      }
      console.log(item, index);
    },
    handleClosePopup(){
      this.$refs.deleteCache.handleClosePopup();
    },
    handleConfirmPopup(){
      this.handleClosePopup();
      this.$u.toast("清理成功");
    },
    // 点击退出登录
    handleLogOut(){
      uni.showModal({
        title: "提示",
        content: "是否确认退出登录",
        success: (res) => {
          if (res.confirm) {
            uni.removeStorageSync('token');
            uni.removeStorageSync('userinfo');
            uni.switchTab({
              url: "/pages/index/index"
            });
          } else if (res.cancel) {

          }
        }
      })
    }
  },
}
</script>

<style lang="scss" scoped>
  .setting-container{
    .mine-info-card{
      padding: 30rpx;
      .cell-item{
        padding: 30rpx 0;
      }
      .cell-item:not(:last-child){
        border-bottom: 1px solid #F2F2F2;
      }
      .cell-item,.value{
        display: flex;
        align-items: center;
        justify-content: space-between;
      }
      .label{
        color: #333333;
        font-size: 26rpx;
      }
      .value{
        color: #999999;
        font-size: 26rpx;
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding-left: 30rpx;
      }
    }
    .logout-btn{
      width: calc(100% - 60rpx);
      position: fixed;
      left: 30rpx;
      bottom: 80rpx;
    }
  }
</style>
